<template>
  <div>
    <button v-color="color1">自定义指令</button>
  <button v-color="color2">自定义指令</button>
  </div>
</template>

<script>
export default {
    data () {
        return {
            color1: 'red',
            color2: 'blue'
        }
    },
    directives: {
        color: {
            inserted (el, binding) {
                el.style.color = binding.value
            },
            update (el, binding) {
                el.style.color = binding.value
            }
        }
    }
}
</script>

<style>

</style>